<template>
    <a-modal
        :bodyStyle="{maxHeight: maxHeight+'px', overflow: 'auto' }"
        :destroyOnClose="true"
        :title="title"
        :width="width"
        :visible="visible"
        :confirmLoading="confirmLoading"
        :maskClosable="maskClosable"
        @ok="ok"
        @cancel="cancel"
        cancelText="关闭"
        :ok-button-props="{ props: { shape:'round'} }"
        :cancel-button-props="{ props: { shape:'round'} }">
        
        <a-spin :spinning="confirmLoading">  
            <component v-if="component" :is="component" ref="component"></component>
        </a-spin>
    </a-modal>
</template>

<script>

export default {
    name:'LModalSelect',
    props:{
        component:{
            type:Object,
            default:()=>{}
        },
        
        title:String,
        width:{
            type:Number,
            default:600
        },
        maxHeight:{
            type:Number,
            default:600
        },
        visible:{
            type:Boolean,
            default:false
        },
        confirmLoading:{
            type:Boolean,
            default:false
        },
        maskClosable:{
            type:Boolean,
            default:true
        },
        labelCol:{
            type:Object,
            default:function(){
                return {sm: { span: 4 }}
            }
        },
        wrapperCol:{
            type:Object,
            default:function(){
                return {sm: { span: 20 }}
            }
        },
        handleOk:Function,
        handleCancel:Function,
  
    },
    data(){
        return{
          
        }
    },
    created(){
       
        
    },
    watch:{
        
    },
    methods:{
        ok(){
            let selectedRecord = this.$refs.component.getSelectedRecord();
            this.$emit('handleOk',selectedRecord);
        },
        cancel(){
            this.$emit('handleCancel');
        },
     
       
    }
}
</script>